// 定义高阶组件强化函数
// 他是一个函数,形参为一个普通的组件
// 函数的返回值为一个类组件
// 这种方式并不是react 官方自创的. 而是社区在使用的时候.自创的. 然后大家都广泛使用了.
// 试一试: 使用高阶组件修改网站背景主题颜色?


// 问题?  当遇到被高阶组件函数包裹的组件是一个子组件,然后该子组件还接收了来自父组件的props
// 这时候怎么办? 数据还在不在?
// 使用es6中对象展开运算符将数据赋值到被包裹的组件上 {...this.props}

import { Component } from "react";

const Hoc = (Com) => {
    return class Newcom extends Component {
        render() {
            return <div style={{ background: 'red' }}>
                <Com {...this.props}></Com>
                <p>我是新增的内容</p>
            </div>
        }
    }
}

export default Hoc;
